<template>
	<view class="content page" style="height: 100%;">
		<scroll-view scroll-y="true" class="list" style="height: 100%;"  @scrolltolower="getMoreList">
			<ul class="ul">
				<li v-for="(item,index) in actList" v-bind:key="index"  @click='linkHref(item)'>
					
					<img :src="item.coverImage"  mode="widthFix" class="right" alt="">
					<div class="left">
						<div class="title">{{item.preferentialTitle}}</div>
					</div>
				</li>
				<div class="load" v-show="isLoadDowning == 1">
					<img class="loadImg" src="https://gateway.yijushenyang.com/static/img/loading.png" alt="">
					<span>加载中</span>
				</div>
				<div class="load" v-show="isLoadDowning == 2">
					<span>没有更多了～</span>
				</div>
			</ul>
		</scroll-view>
	</view>
</template>

<script>
	import config from '../../config.js';
	export default {
		data() {
			return {
				isLoadDowning: 0,
				loadBottom: true,
				pageNum: 1,
				pageSize: 10,
				actList: [
					
				],
				loadISdomn: true,
				act: '',
				title: 'Hello'
			}
		},
		onLoad() {
			this.list()
		},
		onShareAppMessage(res) { //发送给朋友
			return {
				title: '逸居盛京',
				path: '/pages/home/index',
				imageUrl: "",
			}
		},
		onShareTimeline(res) { //分享到朋友圈
			return {
				title: '逸居盛京',
				path: '/pages/home/index',
				imageUrl: "",
			}
		},
		onReachBottom(){
			if(this.loadBottom){
				this.isLoadDowning = 1
				this.pageNum += 1;
				this.list()
			}else{
				this.isLoadDowning = 2
			}
		    console.log('触底了')
		},
		methods: {
	
			list(){
				uni.request({
					url: config.host+'system/preferential/app/listApp', 
					success: (res) => {
						// this.actobj = res.data.rows[0]
						this.actList = res.data.data
						console.log(res.data.data);
					}
				});
			},
			linkHref(row){
				if(row.type == 2){
					uni.navigateTo({
						url: '/pages/policy/detail?id='+row.preferentialUrl
					})
				}else{
					uni.navigateTo({
						url: '/pages/webView/webView?url='+row.preferentialUrl
					})
				}
				
			}
		}
	}
</script>

<style>
	page{
	}
	.content{
		width: 100%;
		padding: 0 20px 0 20px;
		box-sizing: border-box;
	}
	.load{ width: 100%; display: flex; justify-content: center; align-items: center; text-align: center; padding: 10px;}
	.loadImg{
		margin-right: 10px;
		width: 20px;
		height: 20px;
		animation: animation 3s linear infinite;
	}
	.load span{ color: #999; font-size: 14px;}
	@keyframes animation{
		0%{
			transform: rotate(0);
		}
		100%{
			transform: rotate(360deg);
		}
	}
	
	li{
		box-sizing: border-box;
		padding-bottom: 15px;
		padding-top: 15px;
		border-bottom: 1px solid #f8f8f8;
	}
	.left{
		margin: 5px 0 0px 0;
		flex: 1;
		width: 100%;
	}
	.right{
		width: 100%;
		border-radius: 8px; 
		height: 188px; 
		overflow: hidden;
	}
	.title {
		width: 100%;
		font-size: 14px;
		color: #000;
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		text-overflow: ellipsis;
	}
	.des{
		font-size: 10px;
		color: #999;
		margin-top: 10px;
	}
</style>
